nav{

	flex: 1;
	/* display: grid;
	grid-template-rows: repeat(auto-fill, 3rem);	
	grid-row-gap: 1rem;
	padding-top: 3rem; */
	padding-top: 1rem; 
	display: flex;
	flex-direction: column;
	background: red;
	a{ 
		@mixin typo-h4{};
		font-weight: 400;
		height: 2.5rem;
		color: var(txt);
		margin-bottom: 1rem;
		display: grid;
		grid-auto-columns: .25rem .75rem 1.5rem 1rem 1fr;
		grid-auto-flow: column;
		color: var(--txt);

		.bar{
			grid-column: 1;
		}
		c-ico{
			grid-column: 3;
			align-self: center; /* vertical center */
  		justify-self: center; /* horizontal center */
		}
		label, .label{
			grid-column: 5;
			display: flex;
			align-items: center; /* vertical center */			
		}

		&.sel{
			background: #fff;
			.label{
				color: var(--txt-dark);
				font-weight: 600;
			}
			c-ico{
				fill: var(--ico-dark);
			}
			.bar{
				background: var(--bkg-prime);
			}
		}
		&:hover{
			background: #fff;
		}
	}

}